<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>若隐若现</title>
    <script src="js/jquery-1.7.2.js"></script>
</head>
<body>
<style>
    #test {
        width: 600px;
        height: 600px;
        background: url(images/1.jpg) no-repeat center;
        background-size: 100% 100%;
        background-position: center;
        padding: 10px 0;
        opacity: 0.2;
        -webkit-animation: cz_btn 1s linear infinite alternate;
         -webkit-transform: scale(0.6);
         -webkit-transform-origin: center center;
    }
    @-webkit-keyframes cz_btn {
        to{
            opacity: 1;
            -webkit-transform:scale(1);
        }
    }
</style>
    <div id="test"></div>
</body>
</html>